<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="<s:url value="/view/common_view/css/style.css"/>"
	rel="stylesheet" type="text/css" />
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">

<link href="<s:url value="/view/common_view/css/bootstrap.css"/>" rel="stylesheet" type="text/css" />
<link href="<s:url value="view/common_view/css/bootstrap.min.css"/>" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />


<script>
	$(document).ready(function() {
		var cost = $("#deal-buy-price-hidden").val();
		var amount = $("#total-amount").val();
		$("#deal-buy-total").html("<label>" + convertMoney(cost) + "</label>");
		$("#quantity-input-text").bind('keyup', function() {
			var count = parseInt($(this).val());
			if (count > amount) {
				count = amount;
				alert("Số lượng deal còn lại có thể đặt là " + amount);
			}
			if (count > 10) {
				count = 10;
				alert("Số lượng deal phải từ 1-10");
			}
			if (count <= 0) {
				count = 1;
				alert("Số lượng deal phải từ 1-10");
			}
			if (isNaN(count)) {
				count = '';
				
			}
			$(this).val(count);
			var total = count * cost;			
			
			$("#deal-buy-total").html("<label>" + convertMoney(total) + "</label>");
// 			$("#dealbytotal").val(total);

		});
	});
	
	function convertMoney(cost) {
		var sOldMoney=cost+"";
		var results = new Array();
		results = sOldMoney.split(".");
		var lg = results[0].length;
		var count = 0;
		var newMonney = "";
		for (var i = lg - 1; i >= 0; i--) {
			if (count < 3) {
				newMonney = results[0].charAt(i) + newMonney;
				count += 1;
			} else {
				if (i != 0) {
					newMonney = results[0].charAt(i) + "." + newMonney;
					count = 1;
				} else {
					newMonney = results[0].charAt(i) + "." + newMonney;
				}
			}
		}
		return newMonney;
		}
</script>

<script>
 $(function() {
   $( document ).tooltip({
     position: {
       my: "center bottom-12",
       at: "center top",
       using: function( position, feedback ) {
         $( this ).css( position );
         $( "<div>" )
           .addClass( "arrow" )
           .addClass( feedback.vertical )
           .addClass( feedback.horizontal )
           .appendTo( this );
       }
     }
   });
 });
</script>
<title>Đặt mua deal</title>
</head>
<body>
	<div id="maincontent">
		<s:form id="frmorder_deal" action="order-deal" method="post" class="validator">		
			<div id="deal-buy" class="box">
				<div class="box-content">					
					<div id="order-title"><s:property value="getText('title.datmuadeal')"/></div>
					<div id="thongbao1" class="thongbao">
						<div style="color: red" id="message">
							<s:iterator value="arrErrorMessage" status="stt">
								<s:property value="arrErrorMessage.get(#stt.index)" />
								<br />
							</s:iterator>
						</div>
						<div style="color: blue" id="succesmessage">
							<s:property value="successmessage" />
						</div>
						<hr>
					</div>
					<div class="sect">
						<table class="order-table">
							<input type="hidden" name="dealID"
								value='<s:property value="%{deal.dealID}"/>' />
							<input type="hidden" id="total-amount" name="totalamount"
								value='<s:property value="%{deal.totalAmount}"/>' />
							<tbody>
								<tr>
									<th class="deal-buy-desc">Deal</th>
									<th class="deal-buy-quantity"><s:property value="getText('label.soluong')"/></th>
									<th class="deal-buy-multi"></th>
									<th class="deal-buy-price"><s:property value="getText('label.dongia')"/>(<s:property
											value="%{deal.currencyName}" />)
									</th>
									<th class="deal-buy-equal"></th>
									<th class="deal-buy-total"><s:property value="getText('label.thanhtoan')"/> (<s:property value="%{deal.currencyName}" />)
									</th>
								</tr>
								<tr>
									<td class="deal-buy-desc"><s:property
											value="%{deal.dealName}" /></td>
									<td class="deal-buy-quantity"><input
										id="quantity-input-text" type="text" name="quantity" value="1"
										size="1"  title="Số lượng deal được đặt chỉ từ 1 – 10 deal"/></td>
									<td class="deal-buy-multi">x</td>
									<td class="deal-buy-price"><span id="deal-buy-price"><s:property value="%{deal.newSellMoney}" /> <input id="deal-buy-price-hidden"
											value="<s:property value="%{deal.sellPrice}" />" type="hidden"></span>
									</td>
									<td class="deal-buy-equal">=</td>
									<td><div id="deal-buy-total" name="dealtotal"></div> 
<!-- 									<input type="text" id="dealbytotal" name="dealbytotal" hidden="true"></input> -->
									</td>

								</tr>
							</tbody>
						</table>
						<div class="od-notefield">
							<label
								style="float: left; padding-left: 16px; text-align: left; width: 120px; white-space: nowrap; height: 30px; line-height: 30px; font-size: 12px; color: #333;"><s:property value="getText('label.ghichugiaohang')"/></label>
							<textarea name="noteship"
								style="width: 963px; height: 80px; padding: 2px; margin-top: 5px;" title="Nhập thông tin ghi chú để tiện cho việc giao hàng"></textarea>
						</div>
						
						<center>
							<div id="od-form-submit">
								<!-- <input type="submit" class="od-formbutton" name="buy" value="Hoan tat"> -->
									<button class="btn btn-success" type="submit" title="Nhấn để hoàn tất mua deal"><s:property value="getText('button.hoantat')"/></button>
							</div>
						</center>
					</div>
				</div>
			</div>
		</s:form>
	</div>
</body>
</html>